<template>
	<view class="qj-detail">
		<view class="my-list2">
			<view v-if="!obj"><u-empty text="没有数据"></u-empty></view>
			
		    <view class="ml-item-detail" v-else>
				<view class="i-title">
					<view><view class="tip-icon"></view>{{obj.abnormalityType == '0'?'违章':'事故'}}</view>
				
				</view>
				<view class="i-footer">
					<view>状态：{{obj.abnormalityStatus =='WAIT_DRIVER_OPER'?'待驾驶员处理':obj.abnormalityStatus =='WAIT_MANAGER_CHECK'?'待管理员审核':obj.abnormalityStatus =='CHECKED'?'审核通过':obj.abnormalityStatus =='REFUESD'?'审核不通过':'' }}</view>
				</view>
				<view class="i-row">师傅：{{obj.driverInfo}}</view>
				<view class="i-row">车牌：{{obj.plateNum}}</view>
				<view class="i-row">时间：{{obj.abnormalityTime}}</view>
				<view class="i-row">备注：{{obj.note}}</view>
				<view class="i-row">
					<view class="r-title">备注图片：</view>		
				</view>
				<view v-if='obj.abnormalityUrl' style="display: flex;">
					<view v-for="item in abnormalityUrl_list" @click="image_btn( 'https://cba360.com'+item)"
						style="width: 300rpx;height: 300rpx;display: flex;">
						<u-image style="width: 300rpx;height: 300rpx;display: flex;" width="300rpx" height="300rpx"
							:src="'https://cba360.com'+item"></u-image>
					</view>
				</view>
				<view class="i-row">
					<view class="r-title">处理图片：</view>		
				</view>
				<view v-if='obj.proveUrl' style="display: flex;">
					<view v-for="item in proveUrl_list" @click="image_btn( 'https://cba360.com'+item)"
						style="width: 300rpx;height: 300rpx;display: flex;">
						<u-image style="width: 300rpx;height: 300rpx;display: flex;" width="300rpx" height="300rpx"
							:src="'https://cba360.com'+item"></u-image>
					</view>
				</view>
				
				
				<!-- <view class="i-btns">
					<view v-if="obj.leaveState.key == 0" class="btn" :data-obj="obj.id" @click="setDelQjMd">删除记录</view>
				</view> -->
		    </view>
		</view>
		
		<u-modal
			:title="delMd.title" 
			:confirm-style="{'color': '#00c3ce'}"
			v-model="delMd.state" 
			:show-cancel-button="true" 
			@confirm="okDelQj">
			<view class="c-yellow" :style="{'padding': '20rpx', 'text-align': 'center'}">{{delMd.tip}}</view>
		</u-modal>
		<u-mask style="overflow: hidden;" :show="show" @click="show = false">
			<view style="width: 650rpx;height: 650rpx;margin: auto;margin-top: 200rpx;">
				<u-image style="width: 650rpx;height: 650rpx;margin: auto;margin-top: 200rpx;" width="650rpx"
					height="650rpx" :src="imagee"></u-image>
			</view>
		</u-mask>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
				abnormalityUrl_list:[],
				proveUrl_list:[],
				// 详情
				obj: null,
				// 删除--弹框
				delMd: {
					state: false,
					title: '删除提示',
					tip: '', // 提示内容
					obj: null, // 参数对象
				},
				imagee: "",
				show: false,
			}
		},
		onLoad(ps){
			this.getQjDetail(ps.id);
		},
		methods: {
			image_btn(e) {
				this.show = true
				this.imagee = e
			
			},
			// 获取-请假详情
			getQjDetail(id){
				let that = this, U = that.U;
				
				U.qloading('加载中...');
				that.$u.api.getVehicleAbnormalityById({id: id}).then(res => {
					if(res.code == 1){
						U.qclose();
						
						if(res.code != 1){
							U.qerror(res.msg);
						}else{
							that.obj = res.data;
							that.abnormalityUrl_list = res.data.abnormalityUrl.split(",")
							that.proveUrl_list= res.data.proveUrl.split(",")
						}
					}
				}).catch(err => { U.qclose(); });
			},
			// 删除-
			setDelQjMd(e){
				let that = this, U = that.U;
				
				that.delMd = {
					state: true,
					title: '删除提示',
					tip: '确定删除当前请假记录吗？',
					obj: e.currentTarget.dataset.obj
				};
			},
			// 确认删除-
			okDelQj(){
				let that = this, U = that.U, id = that.delMd.obj;
				
				that.$u.api.delQj({did: id}).then(res => {
					if(res.code == 1){
						U.qsuccess(res.msg, 3000, function(){
							// 隐藏弹框
							that.delMd.state = false;
							
							// 调用父级onLoad中的刷新方法
							uni.$emit('refQjList');
							// 返回上一页
							uni.navigateBack({ delta: 1 });
						});
					}else{
						U.qerror(res.msg);
					}
				});
			},
		}
	}
</script>

<style>

</style>
